<rev-images>
<div class="aui-chat-item aui-chat-left">
	<div class="aui-chat-media">
		<img src="{robotInfo.avatar}">
	</div>
	<div class="aui-chat-inner">
		<div class="aui-chat-title">
			<b>{robotInfo.username}</b>
			{timestampFormat(opts.data.timestamp,'YYYY-MM-DD hh:mm:ss')}
		</div>
		<div class="aui-chat-content">
			<div class="aui-chat-arrow"></div>
			<p if={opts.data.text}>{opts.data.text}</p>
			<img src="{image.src}" class={'nine-grid':multi} alt="{image.alt}" each={image in opts.data.images} onclick={clickImg}>
		</div>
		<div class="aui-chat-status aui-chat-status-refresh">
			<i class="aui-iconfont aui-icon-correct aui-text-success"></i>
		</div>
	</div>
</div>

<script>
	let tag = this;
	const weuiJs = require('weui.js');
	tag.on('before-mount', function() {
		tag.multi = opts.data.images && opts.data.images.length > 1;
		tag.robotInfo = tag.getRobotInfo();
	});
	tag.on('mount', function() {
		tag.observable.trigger('app:view:scroll:bottom');
	});
	tag.clickImg = function(e) {
		weuiJs.gallery(e.item.image.src, {
			className: 'no-del'
		});
	}
</script>
<style>
	:scope .nine-grid{
		width: calc(33.33% - 0.2rem);
	    display: inline-block!important;
	    padding: 0 0.1rem 0.1rem 0.1rem;
	    height: calc(33.33vw - 2.4rem);
	}
</style>
</rev-images>